import { useEffect, useState } from 'react';

/**
 * @author liyuan
 * @date 07-18 14:25:31
 * @desc 获取window的宽高
 */
export const useWindow = () => {
  // window size,包含屏幕屏幕的宽高、body的宽高
  const [windowSize, setWindowSize] = useState({
    innerWidth: window.innerWidth,
    innerHeight: window.innerHeight,
    clientWidth: document.documentElement.clientWidth,
    clientHeight: document.documentElement.clientHeight,
  });
  useEffect(() => {
    window.addEventListener('resize', () => {
      setWindowSize({
        innerWidth: window.innerWidth,
        innerHeight: window.innerHeight,
        clientWidth: document.documentElement.clientWidth,
        clientHeight: document.documentElement.clientHeight,
      });
    });
    return () => {
      window.removeEventListener('resize', () => {
        setWindowSize({
          innerWidth: window.innerWidth,
          innerHeight: window.innerHeight,
          clientWidth: document.documentElement.clientWidth,
          clientHeight: document.documentElement.clientHeight,
        });
      });
    };
  }, []);
  /**
   * @author liyuan
   * @date 07-18 14:01:04
   * @desc 滚动到指定位置
   */
  const scrollTo = (x: number, y: number) => {
    window.scrollTo(x, y);
  };
  /**
   * @author liyuan
   * @date 07-18 14:01:54
   * @desc 滚动到顶部
   */
  const scrollToTop = () => {
    window.scrollTo(0, 0);
  };
  /**
   * @author liyuan
   * @date 07-18 14:02:04
   * @desc 滚动到底部
   */
  const scrollToBottom = () => {
    window.scrollTo(0, document.body.scrollHeight);
  };
  /**
   * @author liyuan
   * @date 07-18 14:03:04
   * @desc 滚动到指定元素
   */
  const scrollToElement = (element: HTMLElement) => {
    element.scrollIntoView({
      behavior: 'smooth',
      block: 'start',
      inline: 'nearest',
    });
  };
  return { windowSize, scrollTo, scrollToTop, scrollToBottom, scrollToElement };
};

/**
 * @author liyuan
 * @date 07-23 14:47:58
 * @desc 设置页面标题
 */
export const usePage = () => {
  const setTitle = (title: string) => {
    document.title = title;
  };
  return {
    setTitle,
  };
};
